<script setup lang="ts">
const props = defineProps<{ post: Post; users: User[] }>();
const user = computed(() =>
  props.users.find((u) => u.id === props.post.userId)
);
</script>

<template>
  <li class="flex justify-start items-center gap-x-1">
    <div class="text-lg">
      <NuxtLink :to="`/post/${post.id}`">{{ post.title }}</NuxtLink>
    </div>
    <div
      v-if="user"
      class="text-cyan-500 text-xs uppercase before:content-['@']"
    >
      <NuxtLink to="/"> {{ user.name }}</NuxtLink>
    </div>
  </li>
</template>
